{% extends "base.html" %}   

{% block sidebar %}
	<div class="sidebar">
		<h3>Timeline</h3>
		<ul>
			<li><a href="/timelines/new">Nova Timeline</a></li>
			<li><a href="/timelines/{{timeline_id}}/edit">Editar Timeline</a></li>			
      	</ul>
	</div>
	<div class="sidebar">
		<h3>Eventos</h3>
		<ul>
        	<li><a href="/timelines/{{ timeline_id }}/events/search">Adicionar Eventos</a></li>
        	<li><a href="/timelines/{{ timeline_id }}/import_events">Importar Eventos</a></li>
			<li><a href="/timelines/{{timeline_id}}/vote">Eventos não aprovados</a></li>
      	</ul>
	</div>
	
{% endblock %}

{% block content %}   
	<div class="content">
		<script>
			$("#timelines_menu").addClass("selected");
		</script>  
		
		<!--div class="breadcrumb">
			<span><a href="/timelines">Timelines</a> > </span> 
			<span><a href="">{{timeline.title}}</a></span>
		</div-->
	
		<h1>{{ timeline.title }}</h1>
		<h4>
			{% if not creator %}
				Esta timeline esta sem dono.
			{% else %}
				{{ timeline.creator }}
			{% endif %}
		</h4>
		<h5>{{ timeline.number_of_members }}</h5>
		<p>{{ timeline.description }}</p>
		
		{% ifequal number_of_events 0 %}
			<h5>Esta timeline ainda não possui eventos.</h5>			
		{% endifequal %}
	</div>
{% endblock %}


	{% block timeline %}
	<!-- BEGIN Timeline Embed -->
	<div id="timeline-embed"></div>
	<script type="text/javascript">
	    var timeline_config = {
			width: 	"100%",
			height: "90%",
			source: "{{json}}",
			start_at_end:	false,								//OPTIONAL
			hash_bookmark: false,								//OPTIONAL
			css: '/static/timelinejs/css/timeline.css',				//OPTIONAL
			js: '/static/timelinejs/js/locale/pt-br.js'					//FRENCH
		}
	</script>
	<script type="text/javascript" src="/static/timelinejs/js/timeline-embed.js"></script>
	<!-- END Timeline Embed -->                
	{% endblock %}



